<template>
  <div>
    <h3>App组件</h3>
    <child :users="users">
      <!-- 调用作用域插槽父组件调用方式,row这个名称,可以随意起名 prop record row scope 它为对象 -->
      <!-- <template #default="row">
        <h3 @click="updateUser(row.uid)">修改 -- {{ row }}</h3>
      </template> -->
      <!-- 所以你可以解构来使用 -->
      <template #default="{ uid }">
        <h3 @click="updateUser(uid)">修改</h3>
      </template>
    </child>
  </div>
</template>

<script>
import child from './components/child/index.vue'
export default {
  components: {
    child
  },
  data() {
    return {
      users: [
        { id: 1, name: '张三' },
        { id: 2, name: '李四' }
      ]
    }
  },
  methods: {
    updateUser(id) {
      console.log('id', id)
    }
  }
}
</script>

<style lang="scss" scoped></style>
